<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    <input type="text" class="txt">
    <ul class="list"></ul>
</body>
<script>

    // https://www.baidu.com/sugrec

    const otxt = document.querySelector(".txt")
    const olist = document.querySelector(".list")

    otxt.oninput = function(){
        if(this.value === ""){
            olist.innerHTML = "";
            return;
        }
        
        // 以下为淘宝的搜索下拉菜单接口数据
        jsonp("https://suggest.taobao.com/sug", (res)=>{
            console.log(res);
            let str = "";
            res.result.forEach(val=>{
                str += `<li>${val[0]}</li>`
            })
            olist.innerHTML = str;
        },{
            k:1,
            area:"c2c",
            q:this.value,
            code:"utf-8",
            ts:Date.now(),
            callback:"angscdvgsud"
        }, "callback");

        // 以下为百度的搜索下拉菜单接口数据
        // jsonp("https://www.baidu.com/sugrec", (res)=>{
        //     let str = "";
        //     res.g.forEach(val=>{
        //         str += `<li>${val.q}</li>`
        //     })
        //     olist.innerHTML = str;
        // },{
        //     pre:1,
        //     ie:"utf-8",
        //     p:3,
        //     json:1,
        //     prod:"pc",
        //     from:"pc_web",
        //     sugsid:"36545,38113,38092,38130,37911,38267,38174,38225,38262,37938,38088,26350,38208,37881",
        //     wd: this.value,
        //     req:2,
        //     csor:2,
        //     cb:"ahsgfsbdh",
        //     _:Date.now()
        // }, "cb");
    }
    

    function jsonp(url, success, data, name){
        let str = "";
        for(let i in data){
            str += `${i}=${data[i]}&`;
        }
        const script = document.createElement("script")
        script.src = url + "?" + str.slice(0, -1);
        document.body.appendChild(script);

        // 在局部作用域内定义一个全局函数
        window[data[name]] = function(res){
            success(res);
        }
    }

    
</script>
</html>